<template>
  <div class="m-content-box">
    <div class="m-set-order-box">
      <p class="title">通用积分项设置</p>
      <router-link to="/system/headlinesSettings">
        <el-button class="set-order-edit" type="primary">返回</el-button>
      </router-link>
      <div class="m_setting_integral_control">
        <div class="m-set-container">
          <p>获取方式:</p>
          <div class="top_control">
            <el-radio v-model="radio_fs" label="1">预约</el-radio>
            <el-radio v-model="radio_fs" label="2">签到</el-radio>
          </div>
        </div>
        <div class="m-set-container">
          <p>获取条件:</p>
          <div class="top_control">
            <el-radio v-model="radio_tj" label="1">{{ radio_fs==='1'?'预约':'签到' }}得积分</el-radio>
            <el-radio v-model="radio_tj" label="2">仅会员自主{{ radio_fs==='1'?'预约':'签到' }}得积分</el-radio>
          </div>
        </div>
        <div class="setting_lable m-set-container class-integral">
          <span class="label">团课签到得积分:</span>
          <p class="desc"><el-input v-model="tk" type="text" class="inp-140x34 mr-10" style="width: 140px;" placeholder="请输入积分" />积分/次</p>
        </div>
        <div class="setting_lable m-set-container private-integral">
          <span class="label">精品课签到得积分:</span>
          <p class="desc"><el-input v-model="jpk" type="text" class="inp-140x34 mr-10" style="width: 140px;" placeholder="请输入积分" />积分/次</p>
        </div>
        <div class="setting_lable m-set-container private-integral">
          <span class="label">私教课签到得积分:</span>
          <p class="desc"><el-input v-model="sjk" type="text" class="inp-140x34 mr-10" style="width: 140px;" placeholder="请输入积分" />积分/次</p>
        </div>
      </div>

      <div class="m-set-container comment-integral">
        <span class="label">评价得积分:</span>
        <p class="desc"><el-input v-model="pj" type="text" class="inp-140x34 mr-10" style="width: 140px;" placeholder="请输入积分" />积分/次</p>
      </div>

    </div>

    <div class="m-set-order-box">
      <p class="title">日常赚积分方式（在微信端对会员显示）</p>
      <div class="set-desc_normal">
        <el-input v-model="rczjf" type="textarea" class="set-desc-textarea" style="height: 114px;" :autosize="{ minRows: 4, maxRows: 4}" placeholder="请填写500字之内" />
      </div>
    </div>

    <div class="m-set-order-box">
      <p class="title">积分的用途（在微信端对会员显示）</p>
      <div class="set-desc_normal">
        <el-input v-model="jfdyt" type="textarea" class="set-desc-textarea" style="height: 114px;" :autosize="{ minRows: 4, maxRows: 4}" placeholder="请填写500字之内" />
      </div>
    </div>

    <div class="m-form-footer-btns">
      <el-button type="primary">保存</el-button>
      <el-button type="info">取消</el-button>
    </div>
  </div>
</template>

<script>
import { getXuan } from '@/utils/limits.js'
import { mapGetters } from 'vuex' // Secondary package based on el-pagination

export default {
  name: 'ArticleList',
  components: {
  },
  filters: {
    statusFilter(status) {
      const statusMap = {
        published: 'success',
        draft: 'info',
        deleted: 'danger'
      }
      return statusMap[status]
    }
  },
  data() {
    return {
      radio_fs: '1',
      radio_tj: '1',
      tk: '',
      jpk: '',
      sjk: '',
      pj: '',
      rczjf: '',
      jfdyt: '',
      checkList: ['干货技术', '瑜伽生活']
    }
  },
  computed: {
    ...mapGetters([
      'permission_routes',
      'roles'
    ])
  },
  created() {
    var xuanList = [{
      name: '积分设置',
      url: '/system/editPointSetting',
      pd: true
    }]
    var xuanList1 = getXuan(xuanList, this.roles)
    this.$store.dispatch('user/changeXuan', {
      key: 'xuanList',
      value: xuanList1
    })
    this.$store.dispatch('user/changeXuan', {
      key: 'xuan',
      value: 0
    })
  },
  methods: {
    getList() {
      this.listLoading = true

      this.listLoading = false
    },
    open(type) {
      if (type === 'add') {
        this.add_show = false
      }
      if (type === 'update') {
        this.update_show = false
      }
    }

  }
}
</script>

<style scoped>
.m-content-box {
  position: relative;
  padding: 30px 63px;
  font-size: 14px;
}
.m-set-order-box {
  position: relative;
  margin-bottom: 30px;
}
.m-set-order-box .title {
  position: relative;
  color: #787878;
  font-size: 12px;
  height: 22px;
}
.set-order-edit {
  position: absolute;
  right: 0;
  top: -20px;
}
.m-set-container {
  display: flex;
  align-items: center;
  min-height: 34px;
  background: #f2f2f2;
  padding: 5px 0 5px 10px;
  margin-bottom: 2px;
}
p, ul, dl, dd, li, h1, h2, h3, h4, h5, h6, input {
  margin: 0;
  padding: 0;
  font-weight: 400;
}
.top_control {
  margin-left: 93px;
}

.top_control, .member_seting {
  display: inline-flex;
}
.top_control>.item-r:nth-child(2) {
  margin-left: 44px;
}
.top_control>.item-r>.fr {
  clear: both;
  float: left;
}
.fr {
  float: right;
}
.class-integral>.label {
  margin-right: 52px;
}
.mr-10 {
  margin-right: 10px;
}
.member_seting {
  display: flex;
  min-height: 25px;
  margin-left: 93px;
}
.class-integral>.label {
  margin-right: 52px;
}
.private-integral>.label {
  margin-right: 38px;
}
.comment-integral>.label {
  margin-right: 80px;
}
.set-desc_normal {
  min-height: 18px;
  background: #f2f2f2;
  padding: 12px 10px;
  line-height: 1.8;
}
.m-form-footer-btns {
  padding: 40px 0;
  text-align: center;
}
.set-desc-textarea {
  box-sizing: border-box;
  width: 100%;
  height: 114px;
  padding: 10px;
  line-height: 1.5;
}
</style>
